import { initState } from './state';
import { compilerToFunction } from './compiler/index';
import { mountComponent } from './lifecycle';
import { mergeOptions } from './options';
import { callHook } from './lifecycle';

export function initMixin(Vue) {
    // 初始化
    Vue.prototype._init = function (options) {
        const vm = this;
        vm.$options = mergeOptions(vm.constructor.options, options, vm);
        // initLiftCycle();
        // initEvent();
        // initRender();
        callHook("beforeCreate", vm);
        // initInjection();
        initState(vm);
        // initProvide();
        callHook("created", vm);



        // 初始化完毕，开始进行挂载
        if (vm.$options.el) {
            this.$mount(vm.$options.el);
        }
    }
    Vue.prototype.$mount = function (el) {
        // 获取真实的节点
        el = el && document.querySelector(el);
        const vm = this;
        const options = vm.$options;
        // 将options.el修改为真实节点
        vm.$options.el = el;
        let template;
        // render > template > el
        if (!options.render) {
            if (options.template) {
                if (typeof options.template === 'string') {
                    template = options.template;
                }
            } else if (el) {
                template = getOutHtml(el);
            }
            // 获得的模板，解析模板的到渲染函数render
            const render = compilerToFunction(template);
            options.render = render;
            // mountComponent 挂载开始

            mountComponent(el, vm)
            return this;
        }

    }

    function getOutHtml(el) {
        return el.outerHTML;
    }

}